<template>
  <basic-container>
    <h3>商户管理</h3>
    <div class="search">
      <el-select
        v-model="shopnamevalue"
        filterable
        clearable
        @change="storeaccess"
        placeholder="请选择店铺名称"
      >
        <el-option
          v-for="item in shopname"
          :key="item.value"
          :label="item.label"
          :value="item.value"
        >
        </el-option>
      </el-select>
      <el-select
        v-model="shopkeepervalue"
        filterable
        clearable
        @change="keepersearch"
        placeholder="请选择店主"
      >
        <el-option
          v-for="item in shopkeeper"
          :key="item.value"
          :label="item.label"
          :value="item.value"
        >
        </el-option>
      </el-select>
    </div>
    <avue-crud
      ref="crud"
      :option="option"
      :data="data"
      :page="page"
      @row-save="rowSave"
      @row-update="rowUpdate"
      @row-del="rowDel"
      @on-load="onLoad"
    >
      <template slot="shopNameForm" slot-scope="{ row, disabled }">
        <el-select
          v-model="row.shopName"
          filterable
          placeholder="请选择店铺名称"
          @change="tabkeepersearch(row)"
          :disabled="disabled"
        >
          <el-option
            v-for="item in shopname"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          >
          </el-option>
        </el-select>
      </template>
    </avue-crud>
  </basic-container>
</template>

<script>
// let baseUrl = "http://192.168.0.220:8091";
let baseUrl = "http://122.51.69.142:8091"; //服务器地址
var dicDatas = {
  face: [], //分类下拉框
  list: [],
  shares: [],
  consumTypeId: [
    {
      label: "销售金额",
      value: 1,
    },
    {
      label: "利润金额",
      value: 2,
    },
    {
      label: "成本",
      value: 3,
    },
  ],
  method: [],
};
// const axios= require('axios')

export default {
  data() {
    return {
      page: {
        total: 0,
        pageNum: 1,
        pageSize: 20,
        pageSizes: [20, 30, 40, 50],
      },
      data: [],
      option: {
        addBtn: true,
        addRowBtn: false,
        menuWidth: 250,
        align: "center",
        menuAlign: "center",
        dialogClickModal:false,
        column: [
          {
            label: "序号",
            prop: "id",
            editDetail: true,
            addDisabled: true,
          },
          {
            label: "店铺名称",
            prop: "shopName",
            slot: true,
            formslot: true,
            type: "select",
            rules: [
              {
                required: true,
                message: "请选择店铺名称",
                trigger: "blur",
              },
            ],
            editDetail: true,
          },
          {
            label: "店主",
            prop: "shopkeeper",
            editDetail: true,
            addDisabled: true,
          },
          {
            label: "分成人员",
            prop: "partner",
            editDetail: true,
            type: "select",
            dicUrl: `${baseUrl}/pc/getBindablePartnerList`,
            props: {
              label: "name",
              value: "id",
            },
            rules: [
              {
                required: true,
                message: "请选择分成人员",
                trigger: "blur",
              },
            ],
          },
          {
            label: "分类",
            prop: "goodsCategoryId",
            editDetail: true,
            type: "select",
            dicUrl: `${baseUrl}/pc/getCategoryList`,
            props: {
              label: "name",
              value: "id",
            },
            rules: [
              {
                required: true,
                message: "请选择分类",
                trigger: "blur",
              },
            ],
          },
          {
            label: "分成方式",
            prop: "scaleCategory",
            type: "select",
            dicData: dicDatas.consumTypeId,
            rules: [
              {
                required: true,
                message: "请选择分成方式",
                trigger: "blur",
              },
            ],
          },
          {
            label: "分成系数",
            prop: "scale",
            rules: [
              {
                required: true,
                message: "请输入分成系数",
                trigger: "blur",
              },
            ],
          },
          {
            label: "所属区域",
            prop: "location",
            editDetail: true,
            addDisabled: true,
          },
          {
            label: "酒店地理位置",
            prop: "detailedAddress",
            editDetail: true,
            addDisabled: true,
          },
          {
            label: "创建时间",
            prop: "createdOn",
            editDetail: true,
            addDisabled: true,
          },
          {
            label: "备注",
            prop: "remark",
          },
        ],
      },
      shopname: [],
      shopkeeper: [],
      shopnamevalue: "",
      shopkeepervalue: "",
    };
  },
  mounted() {
    this.shop();
    this.keeper();
    this.getDataList();
  },
  methods: {
    // 进入页面加载
    getDataList() {
      let _this = this;
      _this.$ajax
        .post(`${baseUrl}/pc/getShopkeeperAndPartnerList`, {
          pageNum: _this.page.pageNum,
          pageSize: _this.page.pageSize,
        })
        .then(function (res) {
          //请求成功
          let resData = res.data;
          if (resData.code == 200) {
            _this.page.total = resData.data.count;
            _this.data = resData.data.shopUserList;
          } else {
            _this.$message.error(resData.msg);
          }
        })
        .catch(function (error) {
          //请求失败
          console.log(error);
        });
    },
    // 获取店铺名称
    shop() {
      let _this = this;
      _this.$ajax
        .post(`${baseUrl}/pc/getShopList`)
        .then(function (res) {
          //请求成功
          let resData = res.data;
          if (resData.code == 200) {
            resData.data.forEach((item) => {
              _this.shopname.push({
                value: item.shopId,
                label: item.name,
              });
            });
          } else {
            _this.$message.error(resData.msg);
          }
        })
        .catch(function (error) {
          //请求失败
          console.log(error);
        });
    },
    // 获取店主列表
    keeper() {
      let _this = this;
      _this.$ajax
        .post(`${baseUrl}/pc/getShopkeeperList`)
        .then(function (res) {
          //请求成功
          let resData = res.data;
          if (resData.code == 200) {
            resData.data.forEach((item) => {
              _this.shopkeeper.push({
                label: item.name,
                value: item.id + "",
              });
            });
            // console.log(_this.shopkeeper);
          } else {
            _this.$message.error(resData.msg);
          }
        })
        .catch(function (error) {
          //请求失败
          console.log(error);
        });
      // 获取分成人员列表
      if (dicDatas.list.length == 0) {
        _this.$ajax
          .post(`${baseUrl}/pc/getBindablePartnerList`)
          .then(function (res) {
            //请求成功
            dicDatas.list = [];
            let resData = res.data;
            if (resData.code == 200) {
              resData.data.forEach((item) => {
                dicDatas.list.push({
                  value: item.id,
                  label: item.name,
                });
              });
            } else {
              _this.$message.error(resData.msg);
            }
          })
          .catch(function (error) {
            //请求失败
            console.log(error);
          });
      }
    },
    //店主下拉点击
    keepersearch() {
      let _this = this;
      if (_this.shopkeepervalue == "") {
        _this.shop();
      } else {
        _this.$ajax
          .post(`${baseUrl}/pc/getShopByShopUserId`, {
            shopUserId: _this.shopkeepervalue,
          })
          .then(function (res) {
            //请求成功
            let resData = res.data;
            if (resData.code == 200) {
              _this.shopname = [];
              resData.data.forEach((item) => {
                _this.shopname.push({
                  value: item.shopId,
                  label: item.name,
                });
              });
            } else {
              _this.shopname = [];
              _this.$message.error(resData.msg);
            }
          })
          .catch(function (error) {
            //请求失败
            console.log(error);
          });
      }
    },
    // 分页
    onLoad(page) {
      this.page.pageNum = page.currentPage; //页数
      this.page.pageSize = page.pageSize; //条数
      this.getDataList();
    },
    // 新增
    rowSave(form, done) {
      let _this = this;
      let scale = form.scale + "%";
      _this.$ajax
        .post(`${baseUrl}/pc/bindPartner`, {
          shopId: form.shopName,
          shopUserId: form.partner,
          scale: scale,
          remark: form.remark,
          categoryId: form.goodsCategoryId,
          scaleCategory: form.scaleCategory,
        })
        .then(function (res) {
          //请求成功
          let resData = res.data;
          if (resData.code == 200) {
            _this.$message.success("新增成功");
            _this.getDataList();
          } else {
            _this.$message.error(resData.msg);
          }
        })
        .catch(function (error) {
          //请求失败
          console.log(error);
        });
      done();
    },
    // 保存
    rowUpdate(form, done, loading) {
      var reg = RegExp(/%/);
      let scale;
      if (reg.exec(form.scale)) {
        scale = form.scale;
      } else {
        scale = form.scale + "%";
      }
      let _this = this;
      _this.$ajax
        .post(`${baseUrl}/pc/updateScale`, {
          shopId: form.shopId,
          shopUserId: form.partnerId,
          scale: scale,
          remark: form.remark,
          categoryId: form.goodsCategoryId,
          scaleCategory: form.scaleCategory,
        })
        .then(function (res) {
          //请求成功
          let resData = res.data;
          if (resData.code == 200) {
            setTimeout(() => {
              loading();
            }, 1000);
            _this.$message.success("修改成功");
            _this.getDataList();
          } else {
            _this.$message.error(resData.msg);
          }
        })
        .catch(function (error) {
          //请求失败
          console.log(error);
        });
    },
    // 删除按钮
    rowDel(row) {
      let _this = this;
      _this
        .$confirm("是否删除该条信息？", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        })
        .then(() => {
          _this.$ajax
            .post(`${baseUrl}/pc/deletePartner`, {
              shopId: row.shopId,
              shopUserId: row.partnerId,
              categoryId: row.goodsCategoryId,
            })
            .then(function (res) {
              //请求成功
              let resData = res.data;
              if (resData.code == 200) {
                _this.$message.success("删除成功");
                _this.getDataList();
              } else {
                _this.$message.error(resData.msg);
              }
            })
            .catch(function (error) {
              //请求失败
              console.log(error);
            });
        });
    },
    // 表格店主下拉点击
    tabkeepersearch(row) {
      let _this = this;
      _this.$ajax
        .post(`${baseUrl}/pc/getShopPart`, {
          shopId: row.shopName,
        })
        .then(function (res) {
          //请求成功
          let resData = res.data;
          if (resData.code == 200) {
            row.detailedAddress = resData.data.detailedAddress;
            row.location = resData.data.location;
            row.shopkeeper = resData.data.shopkeeper;
          } else {
            _this.$message.error(resData.msg);
          }
        })
        .catch(function (error) {
          //请求失败
          console.log(error);
        });
    },
    // 店铺下拉点击
    storeaccess() {
      let _this = this;
      if (_this.shopnamevalue == "") {
        _this.$ajax
          .post(`${baseUrl}/pc/getShopkeeperAndPartnerList`, {
            pageNum: _this.page.pageNum,
            pageSize: _this.page.pageSize,
          })
          .then(function (res) {
            //请求成功
            let resData = res.data;
            if (resData.code == 200) {
              _this.page.total = resData.data.count;
              _this.data = resData.data.shopUserList;
            } else {
              _this.$message.error(resData.msg);
            }
          })
          .catch(function (error) {
            //请求失败
            console.log(error);
          });
      } else {
        _this.$ajax
          .post(`${baseUrl}/pc/getShopkeeperAndPartnerList`, {
            shopId: _this.shopnamevalue,
            pageNum: _this.page.pageNum,
            pageSize: _this.page.pageSize,
          })
          .then(function (res) {
            //请求成功
            let resData = res.data;
            if (resData.code == 200) {
              _this.page.total = resData.data.count;
              _this.data = resData.data.shopUserList;
            } else {
              _this.$message.error(resData.msg);
            }
          })
          .catch(function (error) {
            //请求失败
            console.log(error);
          });
      }
    },
  },
};
</script>

<style>
.search {
  margin: 10px 0;
}

.search .el-select {
  margin-right: 10px;
  margin-bottom: 10px;
}
</style>
